<template>
  <div>
    <a-card :bordered="false">
      <div class="table-operations">
        <div class="table_title">{{ title }}</div>

        <a-tooltip title="刷新">
          <a-icon
            @click="getList"
            class="action"
            :type="loading ? 'loading' : 'reload'"
          />
        </a-tooltip>
      </div>
      <a-table
        :loading="loading"
        rowKey="rowKey"
        size="middle"
        :columns="columns"
        :data-source="list"
        :pagination="false"
      >
        <span slot="status" slot-scope="text, record">
          <a-badge
            :status="record.status == '0' ? 'processing' : 'error'"
            :text="statusFormat(record)"
          />
        </span>
        <span slot="counts" slot-scope="text, record">
          <a
            @click="handleShowRecord(record)"
            v-if="text"
            style="font-weight: bold"
          >
            {{ text }}
          </a>
        </span>
        <span slot="amount" slot-scope="text">
          ¥ {{ formatNumber(text) }}
        </span>
      </a-table>
    </a-card>
    <a-modal
      :visible="showRecordModal"
      title="资方放款明细"
      v-if="showRecordModal"
      @cancel="showRecordModal = false"
      @ok="showRecordModal = false"
      width="1200px"
      :dialog-style="{ top: '20px', heigth: '600px' }"
    >
      <a-card :bordered="false" class="table-card">
        <capbill-record
          v-if="showRecordModal"
          ref="capbillRecord"
          :orgType="orgType"
          :parentQueryParam="queryParam"
          @ok="getList"
          @close="showRecordModal = false"
        />
      </a-card>
    </a-modal>
  </div>
</template>

<script>
import { listBizCapBillDetail } from "@/api/biz/bizCapBill";

import capbillRecord from "@/views/biz/statistics/capbillRecord";
export default {
  name: "CapbillRecord",
  props: {
    parentQueryParam: {
      type: Object,
    },
    title: {
      type: String,
      default: "子表",
    },
    orgType: {
      type: String,
    },
  },
  components: { capbillRecord },
  data() {
    return {
      showRecordModal: false,
      showAddSubModal: false,
      showEditSubModal: false,
      list: [],
      selectedRowKeys: [],
      selectedRows: [],
      // 高级搜索 展开/关闭
      advanced: false,
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      ids: [],
      dictLabels: [],
      loading: false,
      total: 0,
      // 状态数据字典
      statusOptions: [],
      queryParam: {},
      columns: [
        {
          title: "产品名称",
          dataIndex: "productName",
          ellipsis: true,
          align: "center",
          width: "210px",
          scopedSlots: { customRender: "jinjianId" },
        },
        {
          title: "放款笔数",
          dataIndex: "counts",
          ellipsis: true,
          align: "center",
          width: "80px",
          scopedSlots: { customRender: "counts" },
        },
        {
          title: "放款金额(元)",
          dataIndex: "fkAmount",
          scopedSlots: { customRender: "amount" },
          align: "right",
          width: "180px",
        },

        {
          title: "收入金额(元)",
          dataIndex: "serviceAmountCheck",
          ellipsis: true,
          align: "right",
          width: "180px",
          scopedSlots: { customRender: "amount" },
        },
        {
          title: "资方结算金额(元)",
          dataIndex: "zifangAmount",
          align: "right",
          width: "180px",
          scopedSlots: { customRender: "amount" },
        },
      ],
    };
  },
  filters: {},
  created() {
    this.getList();
  },
  computed: {},
  watch: {},
  methods: {
    handleShowRecord(record) {
      this.orgType = record.orgType;
      this.queryParam.productId = record.productId;
      this.showRecordModal = true;
      console.log("查看记录", this.orgType);
    },
    getList() {
      this.loading = true;
      this.queryParam.orgType = this.orgType;
      this.queryParam.deptId = this.parentQueryParam.deptId;
      this.queryParam.userId = this.parentQueryParam.userId;
      this.queryParam.productId = this.parentQueryParam.productId;
      this.queryParam.dateRange = this.parentQueryParam.dateRange;
      console.log("父组件传递的参数d", this.parentQueryParam);
      console.log("传递的参数d", this.queryParam);
      const param = this.addDateRange(
        this.queryParam,
        this.queryParam.dateRange
      );
      listBizCapBillDetail(param).then((response) => {
        console.log("listBizCapBillDetail", response);
        this.list = response.data;
        this.loading = false;
      });
    },

    /** 搜索按钮操作 */
    handleQuery() {
      this.getList();
    },

    formatNumber(num) {
      console.log("formatNumber", num);
      return parseFloat(num || 0).toFixed(2);
    },

    /** 重置按钮操作 */
    resetQuery() {
      this.queryParam = {
        orgType: undefined,
      };
      this.handleQuery();
    },
  },
};
</script>
